const left = document.querySelector('.left')
const right = document.querySelector('.right')

left.addEventListener('mouseenter', ()=> {
    left.classList.add('show')
    right.classList.add('hidden')
})
left.addEventListener('mouseleave', ()=> {
    left.classList.remove('show')
    right.classList.remove('hidden')
})
right.addEventListener('mouseenter', ()=> {
    right.classList.add('show')
    left.classList.add('hidden')
})
right.addEventListener('mouseleave', ()=> {
    right.classList.remove('show')
    left.classList.remove('hidden')
})